//关卡选择Layer

var stageSheet = {
	itemCount : 10,
	itemX : 10,
	topY : 10,
	itemWidth : 100,
	itemHeight : 100,
	itemSpace : 10,
	
	node : null,
	stageSprite : [],
	selectedid : -1,
	
	handlingMoving : false,
	nodeBBox : null,
	
	stageStatusImage : [ resource.unlock_png, resource.lock_png, resource.purchase_png ],
	
	IndexToCoord : function(index){
		return {
			x : stageSheet.itemX,
			y : stageSheet.topY - (index + 1) * stageSheet.itemSpace - (index + 0.5) * stageSheet.itemHeight
		};
	},
	
	CoordToIndex : function(coord){
		return Math.round(((stageSheet.topY - stageSheet.itemSpace - 0.5 * stageSheet.itemHeight) - coord.y) / (stageSheet.itemHeight + stageSheet.itemSpace));
	},
	
	LayerToNodeCoord : function(coord){
		return {x : coord.x - this.node.x, y : coord.y - this.node.y};
	},
	
	NodeToLayerCoord : function(coord){
		return {x : coord.x + this.node.x, y : coord.y + this.node.y};
	},
	
	OnStageClick : function(touch, event){
		var background = new cc.Sprite(resource.background_png);
		background.attr({scale:SC, color:cc.color(192,192,192)});
		loadBattle.Initialize();
		loadBattle.layer = new LoadBattleLayer(false, true, background);
		sysMenuScene.scene.addChild(loadBattle.layer);
		loadBattle.layer.show();
		//no bad result of layer-destroy
		setTimeout(function(){ loadBattle.ShowStatus(1); }, (loadBattle.layer.showDuration + 0.2) * 1000 );
	}
};

var StageSheetLayer = CanvasLayer.extend({
	
	ini : function(){
		var winSize = cc.director.getWinSize();
		
		stageSheet.itemCount = stage.length;
		stageSheet.itemX = winSize.width * 0.5;
		stageSheet.topY = winSize.height;
		stageSheet.itemWidth = winSize.width * 0.8;
		stageSheet.itemHeight = winSize.height * 0.2;
		stageSheet.itemSpace = winSize.height * 0.04;
		
		stageSheet.stageStatusImage = [ resource.unlock_png, resource.lock_png, resource.purchase_png ];
		
		stageSheet.nodeBBox = {
			left : 0,
			right : 0,
			top : stageSheet.itemCount * (stageSheet.itemHeight + stageSheet.itemSpace) + stageSheet.itemSpace
				- winSize.height,
			bottom : 0,
		};
		
		this._AddFreeMoveNode();
		
		this._selectedid = -1;
		
		stageSheet.stageSprite = [];
		for (var stageid = 0; stageid < stageSheet.itemCount; stageid++){
			var centerCoord = stageSheet.IndexToCoord(stageid);
			
			var sprite = new cc.Scale9Sprite(resource.scale9halfwhite100100_png, cc.rect(0,0,100,100), cc.rect(8,8,84,84));
			sprite.setContentSize(stageSheet.itemWidth, stageSheet.itemHeight);
			sprite.attr({
				x : centerCoord.x,
				y : centerCoord.y,
				color : cc.color(0,0,0)
			});
			stageSheet.node.addChild(sprite, stageid);
			stageSheet.stageSprite[stageid] = sprite;
			
			var tStage = stage[stageid];
			
			var labelTitle = cc.LabelTTF.create(tStage.title, "simhei", 64);
			labelTitle.attr({
				anchorX : 0,
				anchorY : 1.0,
				x : centerCoord.x - 0.3 * stageSheet.itemWidth,
				y : centerCoord.y + 0.4 * stageSheet.itemHeight
			});
			stageSheet.node.addChild(labelTitle, stageSheet.itemCount);
			
			var tip = "[" + tStage.time_ref.time[0] + "-" + tStage.time_ref.time[1] + "-" + tStage.time_ref.time[2]
				+ "] [" + tStage.zone.xsize + "×" + tStage.zone.ysize
				+ "] [" + tStage.force[0].name + " vs " + tStage.force[1].name + "]";
			var labelTip = cc.LabelTTF.create(tip, "simhei", 28);
			labelTip.attr({
				anchorX : 0,
				anchorY : 1.0,
				x : centerCoord.x - 0.3 * stageSheet.itemWidth,
				y : centerCoord.y + 0.4 * stageSheet.itemHeight - 64 - 16,
				color : cc.color(191, 191, 191)
			});
			stageSheet.node.addChild(labelTip, 100);
			
			var flag0 = new cc.Sprite(tStage.force[0].flag);
			flag0.attr({ x : centerCoord.x - 0.42 * stageSheet.itemWidth, y : centerCoord.y - 0.21 * stageSheet.itemHeight, scale : 3});
			stageSheet.node.addChild(flag0, 100);
			
			var flag1 = new cc.Sprite(tStage.force[1].flag);
			flag1.attr({ x : centerCoord.x - 0.42 * stageSheet.itemWidth, y : centerCoord.y + 0.21 * stageSheet.itemHeight, scale : 3});
			stageSheet.node.addChild(flag1, 100);
			
			var vs = new cc.Sprite(resource.vs_png);
			vs.attr({ x : centerCoord.x - 0.42 * stageSheet.itemWidth, y : centerCoord.y, scale : 0.75, color : cc.color(233,233,216)});
			stageSheet.node.addChild(vs, 100);
			
			var status = new cc.Sprite(stageSheet.stageStatusImage[stageStatus[stageid]]);
			status.attr({ x : centerCoord.x + 0.42 * stageSheet.itemWidth, y : centerCoord.y, scale : 1.5 });
			stageSheet.node.addChild(status, 100);
		}
	},
	
	_AddFreeMoveNode : function(sender){
		stageSheet.node = new cc.Node();
		stageSheet.node.attr({ x : 0, y : 0});
		this.node.addChild(stageSheet.node);
		
		var tilelistener = cc.EventListener.create({
			event: cc.EventListener.TOUCH_ONE_BY_ONE, //TOUCH_ONE_BY_ONE 为单次触摸事件监听器
			swallowTouches: true,
			onTouchBegan:function (touch,event) {
				if (stageSheet.selectedid >= 0 &&  stageSheet.selectedid < stageSheet.itemCount){
					stageSheet.stageSprite[stageSheet.selectedid].setColor(cc.color(0,0,0));
				}
				var winLoc = touch.getLocation();
				stageSheet.selectedid = stageSheet.CoordToIndex(stageSheet.LayerToNodeCoord(winLoc));
				if (stageSheet.selectedid >= 0 &&  stageSheet.selectedid < stageSheet.itemCount){
					stageSheet.stageSprite[stageSheet.selectedid].setColor(cc.color(127,127,127));
				}
				return true;
			},
			onTouchMoved: function (touch, event) {
				var delta = touch.getDelta();
				if (Math.abs(delta.y) > 2){
					stageSheet.handlingMoving = true;
					stageSheet.node.y += delta.y;
				}
			},
			onTouchEnded:function (touch, event) {
				if (stageSheet.handlingMoving){
					stageSheet.handlingMoving = false;
					//view goback
					var backX = stageSheet.node.x;
					var backY = stageSheet.node.y;
					var bMove = false;
					if (backY < stageSheet.nodeBBox.bottom) {
						backY = stageSheet.nodeBBox.bottom;
						bMove = true;
					}else if (backY > stageSheet.nodeBBox.top) {
						backY = stageSheet.nodeBBox.top;
						bMove = true;
					}
					if (bMove){
						stageSheet.node.runAction(cc.moveTo(0.2, backX, backY));
					}
				}else{
					stageSheet.OnStageClick(touch, event);
				}
			}
		});
		
		cc.eventManager.addListener(tilelistener, this);
	},
});